HTML - die Hypertext Markup Language HTML - die Hypertext Markup Language
Alles spricht vom World Wide Web, dem weltumspannenden Hypertext-Medium ohne ersichtliche Grenzen. Manch Kreativem stellt sich da die Frage, wie man Seiten selbst macht? Mit der passenden Sprache: HTML.
von David G�hler
HTML ist eine einfache �Sprache�, die mit wenigen Kommandos auskommt. Sprache ist dabei fast zu hoch gegriffen, da es keine Funktionen, Prozeduren oder Variablen gibt. Vielmehr werden in normalen ASCII-Text nur ein paar zus�tzliche Befehle eingestreut, die einem Anzeigeprogramm wie �AMosaic� mitteilen, wie Text oder Bilder dargestellt werden sollen.
Dabei spielt das Wort �sollen� eine wichtige Rolle: Die Anweisungen auf einer Seite legen nicht exakt fest, wie sie auszusehen hat. Vielmehr sind es ernste Empfehlungen, die man auch mi�achten kann. Die Anweisung f�r fette Schrift lautet beispielweise <B>. Der Benutzer der Anzeigers (auch Browser genannt) kann aber immer selbst festlegen, welche Schrift daf�r auf seinem Rechner verwendet werden soll. Er kann auch eine nicht-fette Schrift w�hlen. Insbesondere gilt dies auch f�r verschiedene Schriftgr��en. So kann es sein, da� von den sechs verschiedenen �berschriften H1 bis H6, die kleinste (H6) kleiner als normale Schrift ist. Dies sollte man immer im Hinterkopf haben.
Eine normale HTML-Seite enth�lt einige immer wiederkehrende Kommandos, auf die man nicht verzichten kann und sollte (s. Bild). Leicht zu sehen ist, da� jedes Kommando von den beiden Zeichen �<� und �>� umrahmt wird. Oft gibt es von einem Kommando zwei sehr �hnliche Varianten, die sich nur durch den Schr�gstrich �/� nach der spitzen Klammer unterscheiden. Ohne den Schr�gstrich wird damit etwas eingeschaltet, das gleiche Kommando mit dem Schr�gstrich schaltet die Einstellung wieder aus. Daher steht am Anfang die Anweisung <HTML> und ganz zum Schlu� der Seite </HTML>. Die zwei Anweisungen HEAD und BODY (Kopf und K�rper) teilen das Dokument in zwei Teile: Im Kopf werden grunds�tzliche Einstellungen vorgenommen, im K�rper stehen die Texte und Befehle, die man schlie�lich im Browser sieht. Kommentare fangen mit �<!-� an und h�ren mit �->� auf. Sie k�nnen �berall stehen.
Die wichtigsten Kommandos finden Sie im Kasten �Wichtige HTML-Kommandos�. Neben den Befehlen, die etwas ein- und ausschalten, gibt es auch solche, die als Single vorkommen und kein Gegenst�ck mit Schr�gstrich haben.
<BR> steht beispielsweise f�r Break (Bruch) und erzwingt einen Zeilenumbruch. Dieser Befehl ist auch n�tig, da ein Web-Anzeiger Leerzeilen und Zeilenumbr�che im Originaltext einfach ignoriert (vergl. Bild und Originaltext).
Bei Tabellen ist das nat�rlich ganz sch�n l�stig, daher kann man auch in einen Modus schalten, in dem AMosaic den Text so �bernimmt, wie er im Texteditor eingegeben wurde. Dieser Modus ist mit <PRE> ein- und mit </PRE> auszuschalten. Allerdings f�hrt dies auch dazu, da� eine nicht-proportionale Schrift zum Einsatz kommt.
Mit <P> f�gt der Web-Autor einen Absatz ein. Als Alternative zum Abgrenzen eines Abschnitts zum n�chsten gibt es auch noch die waagerechte Linie, die der Browser f�r <HR> in die Seite einbaut.
Nun ist das WWW nicht nur seiner Texte wegen bekannt, sondern auch f�r seine Bilder und Querverweise. Bilder lassen sich mit dem Kommando <IMG> in den Text einbinden. Hierzu ist nat�rlich anzugeben, wie das Bild hei�t und wo es zu finden ist. Bevor daher die abschlie�ende spitze Klammer erscheint, kann man hinter �IMG� weitere Schl�sselw�rter angeben, wobei �SRC� dem Dateinamen vorangeht. Fehlt ein Pfad (gibt man also nur den Dateinamen an), mu� das Bild im gleichen Verzeichnis wie die HTML-Seite stehen. Ein Beispiel ist wiederum im Bild zu sehen. Nat�rlich lassen sich Abbildungen auch in Unterverzeichnisse packen. Dann ist der Verzeichnisname wie gewohnt vorne hinzuzuf�gen.
Neben Bildern machen die schier endlosen Querverweise die Faszination des Webs aus. Ziele solcher Querverweise k�nnen ganze Seite oder auch Positionen (Anker) auf einer Seite sein. Ein Verweis kann irgendwo hinf�hren, die ganze Welt des Internets ist erreichbar. Deshalb mu� bei einem Punkt, von dem aus verzweigt wird, eine eindeutige Adresse stehen, die sog. URL (Uniform Resource Locator).
Sie besteht aus mehreren Elementen:
dem Dienstbezeichner, meist http:
zwei Schr�gstrichen //
einem Rechnernamen
einem weiteren Schr�gstrich
und dem Namen einer HTML-Datei, evtl. mit Pfadangabe,
wo sie zu finden ist
daran kann sich noch ein Doppelkreuz �#� und eine benannte
Position auf der Seite (Anker) anschlie�en.
Fehlt die Angabe der HTML-Datei, erh�lt man die voreingestellte Einstiegsseite.
M�chte man beispielweise die Hauptseite von AMIGA Technologies ansehen, lautet die Adresse:
HTTP://www.amiga.de/
M�chte man nun auf der zu erstellenden Seite einen Verweis auf diese Seite einbauen, sind drei Teile einzugeben:
Ein Startkommando mit Angabe der Seite als URL;
Text, den der Benutzer sieht und auf den er
klickt, um zu verzweigen;
Das Endekommando.
Ein Beispiel ist wieder im abgeruckten Bild in der drittletzten Zeile zu sehen. Mit <A HREF="URL"> wird die Zielseite adressiert. Dort kann - wie im Beispiel - nur der Name einer HTML-Datei, aber auch eine komplette URL stehen. Steht dort nur der Name, wird die zugeh�rige Seite aus dem gleichen Verzeichnis geholt, in dem auch die aktuelle Seite zu finden ist.
Anschlie�end sollte man Text einf�gen, der unterstrichen erscheint. Der Benutzer wei� dann, da� er auf diesen Text klicken kann, um weiterzuverzweigen. Statt Text k�nnen Sie dort aber auch ein Inline-Bild mit dem Befehl IMG angeben. Zum Schlu� mu� ein </A> stehen. Sie hebt die Unterstreichung f�r den folgenden Text auf.
Wenn Sie �brigens statt einer HTML-Seite bei einem Verweis direkt den Namen eines Bildes angeben, wird dieses Bild geladen und �extern� angezeigt. D.h. AMosaic startet dazu extra ein Programm wie �Multiview�. Dies bietet sich im Zusammenspiel mit kleinen Inline-Grafiken an, die im Textdokument zu sehen sind. Spricht den Leser das kleine Bild an, kann er draufklicken und es sich in gro� ansehen.
Um einen Anker auf der Seite zu benennen, ist ebenfalls <A> zu verwenden und statt HREF das Schl�sselwort �NAME� anzugeben. Dahinter mu� der Name des Ankers stehen, den man dann bei einem Verweis mit Doppelkreuz angibt.
Damit HTML-Dokumente auch Sonderzeichen enthalten k�nnen, hat man sich auf einen gemeinsamen Zeichensatz geeinigt, der - wen wundert's - exakt dem Amiga-Zeichensatz entspricht. Da MS-DOS-Kisten aber einen anderen verwenden, kann man Zeichen �ber ASCII 128 auch als Nummern angeben: �&#xxx;�. F�r xxx ist der ASCII-Wert einzusetzen. ü ist also ein �.
Dieser Artikel kann das Thema leider nicht ersch�pfend erl�utern. Im WWW findet man zu HTML reichlich Informationen. Eine gute Quelle ist auch die Datei �HTML-3.0-Guide�, das wir f�r Sie auf die PD-Diskette Nr. 2 gepackt haben. Sie enth�lt eine komplette Beschreibung von HTML 3.0 als AmigaGuide-Datei.
Literatur:[1] Russ Jones & Adrian Nye: HTML und das World Wide Web, O'Reilly International Thomson Verlag, ISBN 3-930673-34-7, Preis: 29 Mark.
[2] Mary E.S. Morris, HTML - WWW effektiv nutzen, Heinz Heise Verlag, ISBN 3-88229-061-7, Preis: ca. 70 Mark inkl. CD
[3] Aminet: docs/hyper, Dokumente �html20gu.lha� und �html30gu.lha�.
[4] HTML-Einf�hrung von Hubert Partl, Universit�t Wien
Startbefehl Endbefehl Beschreibung
Grunds�tzliche Befehle
<HTML> </HTML> Kennung f�r das gesamte Dokument
<HEAD> </HEAD> Umgibt den Kopfteil der Seite
<TITLE> </TITLE> Bezeichnung der Seite
<ISINDEX> </ISINDEX> Erlaubt die Suche nach Begriffen
<BODY> </BODY> Umgibt den sichtbaren Inhalt der Seite
<H1> - <H6> </H1> - <H6> �berschriften versch. Gr��e
<!- ...-> Kommentar (wird nicht angezeigt)
<PRE> </PRE> Text wie angegeben anzeigen (nicht umbrechen!)
<A> </A> Verweis, zu dem oder von dem verzeigt werden kann
Auszeichnungen
<B> </B> Halbfette Schrift (bold)
<I> </I> Kursive Schrift (italic)
<TT> </TT> Nicht-proportionale Schrift
<CITE> </CITE> Zitat-Schrift, meist kursiv
<CODE> </CODE> Listing-Schrift, nicht proportional
<EM> </EM> Hervorgehobener Text, meist kursiv
<KBD> </KBD> Tastatureingabe-Schrift, nicht proportional
<STRONG> </STRONG> Stark hervorgehobener Text, meist fett
Listen
<UL> </UL> Unsortierte Liste
<LI> Element einer Liste
<OL> </OL> Sortierte Liste
<DIR> </DIR> Verzeichnisliste
<DL> </DL> Glossar-�hnliche Liste
<DT> Ein Begriff des Glossars (Term)
<DD> Definition des Glossar-Begriffs
Nicht blockorientierte Kommandos
<P> F�gt ein Absatzende ein
<IMG> F�gt ein Bild ein
<BR> Zeilenumbruch
<HR> waagerechte Linie
Wenn man im Web surft (wie es so sch�n hei�t), kommen die Daten vom Web-Server unverschl�sselt als Text beim eigenen Rechner an. Es gibt also keine bin�ren Sonderformen, die �ber das Netz verschickt werden. So wie der Autor die Seite geschrieben hat (mit allen Befehlen), landet sie beim Leser.
Jeder Browser kann daher auch - neben der interpretierten Form mit verschiedenen Schriften und Bildern - auch die Urform anzeigen. Bei AMosaic hei�t der Men�punkt �View Source...�. Damit kann man gucken, wie der eine oder andere bestimmte Seiten gestaltet hat und wie die Kommandos dazu aussehen. Dar�berhinaus kann man diese Seite mit �Save as...� auch noch als HTML-Seite speichern.
Dem �Klauen� sind damit keine Grenzen gesetzt. Aber da man nur guckt, wie andere die Form gestalten, ist dies legitim; schlie�lich mu� man den Inhalt selbst gestalten - und darauf kommt es an.
Um alle M�glichkeiten von HTML aussch�pfen zu k�nnen, mu� man einen Web-Server installieren. Das ist das Gegenst�ck zu einem Anzeiger wie AMosaic. Ein Server liefert auf Anfrage eines Anzeigers die Bilder, Texte, Animationen und T�ne. Solche Server-Programme gibt es zwei f�r den Amiga: �AWS� und �httpd�. Beide sind �ber �http://www.omnipresence.com/� zu erhalten.
AWS ist deutlich einfacher zu installieren, kann daf�r aber nicht alles. �httpd� ist eine Portierung von UNIX und damit denkbar komplett, aber auch etwas kompliziert. Welches Programm man verwendet, ist daher Geschmackssache.
� Copyright by MagnaMedia Verlag AG, Haar bei M�nchen
Ver�ffentlichung und Vervielf�ltigung nur mit schriftlicher Genehmigung des Verlags